<!--
 * @Descripttion: 订单详情
 * @version: 
 * @Author: mmzhang
 * @Date: 2021-07-20 14:39:20
 * @LastEditTime: 2022-11-02 16:48:51
-->
<template>
  <div class="order-detail" v-if="Object.keys(detailMsg).length">
    <!--订单信息-->
    <order-msg :detailMsg="detailMsg" :businessId="businessId"
      :orderStatusName="orderStatusName" @onGetOrderDetail="getSubOrderDetail"
      @auditSuccess='onAuditSuccess'></order-msg>
    <div class="order-content" ref="orderContent">
      <Tabs type="card" v-model="showTab">
        <TabPane label="认购详情" name="orderDetail">
          <div class="sub-detail">
            <!--附加提示信息-->
            <slot-msg-new :detailMsg="detailMsg" :orderStatusName="orderStatusName"
              :buildingId="buildingId" :subscriptionId="businessId"
              @onGetOrderDetail="getSubOrderDetail"></slot-msg-new>
            <!--订单备注-->
            <order-remark :detailMsg="detailMsg" :subscriptionId="businessId" :contractId="''"
              :orderStatusName="orderStatusName" @onGetOrderDetail="getSubOrderDetail">
            </order-remark>
            <!--破底价-->
            <floor-price-desc :detailMsg="detailMsg" :orderStatusName="orderStatusName">
            </floor-price-desc>
            <!--房源信息-->
            <room-msg :detailMsg="detailMsg" :orderStatusName="orderStatusName"></room-msg>
            <!--认购信息-->
            <sub-msg :detailMsg="detailMsg" :buildingId="buildingId" :orderId="businessId"
              :orderStatusName="orderStatusName" @onGetOrderDetail="getSubOrderDetail">
            </sub-msg>
            <!--认购人信息-->
            <contractor-msg :detailMsg="detailMsg" :buildingId="buildingId"
              :orderStatusName="orderStatusName" :subscriptionId="businessId"
              @onGetOrderDetail="getSubOrderDetail" :isSub="true"></contractor-msg>
            <!--关联订单-->
            <link-order :detailMsg="detailMsg" :buildingId="buildingId"
              :subscriptionId="businessId"></link-order>
          </div>
        </TabPane>
        <TabPane label="认购附件" name="orderEnclosure">
          <enclosure-msg :contractId="businessId" :code="code" v-if="showTab=='orderEnclosure'"
            :orderStatusName="orderStatusName" :detailMsg="detailMsg"></enclosure-msg>
        </TabPane>
        <TabPane label="操作记录" name="orderOperate">
          <operate-msg :code="code" v-if="showTab=='orderOperate'" :buildingId="buildingId"
            :subscriptionId="businessId"></operate-msg>
        </TabPane>
      </Tabs>
    </div>
  </div>
</template>
<script>
  import subMgr from '@/biz/sales/subOrder'
  import orderMsg from '../components/orderMsg.vue'
  import slotMsgNew from '../components/slotMsgNew.vue'
  import orderRemark from '../components/orderRemark.vue'
  import roomMsg from '../components/roomMsg.vue'
  import subMsg from '../components/subMsg.vue'
  import contractorMsg from '../components/contractorMsg.vue'
  import linkOrder from '../components/linkOrder.vue'
  import enclosureMsg from '../components/enclosureMsg.vue'
  import operateMsg from '../components/operateMsg.vue'
  import floorPriceDesc from '../components/floorPriceDesc.vue'
  import watermark from '@/common/waterMark'
  import dt from '@dt/dt'
  export default {
    components: {
      orderMsg,
      orderRemark,
      slotMsgNew,
      roomMsg,
      operateMsg,
      subMsg,
      contractorMsg,
      linkOrder,
      enclosureMsg,
      floorPriceDesc
    },
    data() {
      return {
        showTab: 'orderDetail',
        detailMsg: {},
        businessId: '',
        orderStatusName: '认购',
        code: '',
        buildingId: '',
        detailParams: {}
      }
    },
    watch: {
      showTab(val, oldVal) {
        if (val) {
          this.code = this.detailMsg.orContractBaseInfoVO.contractCode
        }
      },
    },
    created() {
      let detailParams = this.$route.query

      this.businessId = detailParams.businessId

      this.showTab = detailParams.showTab

      this.buildingId = detailParams.buildingId

      this.getSubOrderDetail()
    },
    mounted() {
      watermark.set()
      this.$dt.stats.subscriptionAudit.start()
    },
    methods: {
      onAuditSuccess() {
        this.$dt.stats.subscriptionAudit.end()
      },
      // 获取订单详情
      getSubOrderDetail() {
        this.detailMsg = {}
        let params = {
          orderId: this.businessId,
        }
        subMgr
          .getSubOrderDetail(params)
          .then((res) => {
            this.detailMsg = { ...res }
            watermark.set()
          })
          .catch((res) => {
            this.detailMsg = {}
          })
      },
    },
  }
</script>
<style lang="scss" scoped>
  .order-detail {
    padding: 20px;
    font-size: 16px;

    .order-content {
      margin-top: 30px;

      .sub-detail {
        padding: 20px 100px;
        max-height: 650px;
        overflow-y: auto;
      }

      ::v-deep .ivu-tabs-content {
        height: 100%;

        .title {
          font-size: 20px;
          color: #333;
        }
      }
    }
  }
</style>